ul {
	list-style: none;
}
.header {
	.top-header{
		background:#333333;
		width: 100%;
	}
	.inner {
		padding: 15px;
	}
	.navbar-inverse {
		background:none;
		border:0;
		margin-bottom:0;
	}
	.navbar-brand {
		float: none;
		padding: 0;
		height: auto;
		display: block;

		img {
			width: 100%;
		}
	}
	.list-1 {
		margin: 0;
		padding: 0;
		text-align: center;
		font-size: 2.7em;

		li {
			display: block;
			width: 32.333%;
			float: left;
			text-align: center;
			vertical-align: middle;

			.navbar-header {
				display: inline-block;
				float: none;
			}
			.btn {
				padding: 0;
				margin: 0;
				background: none;
				display: inline-block;

				img {
					width: 100%;
				}
			}
		}
	}
	.form-search {
		overflow: hidden;
		width: 100%;
		background: black;
		line-height: 2.7em;
		margin-top: 0px;
		display: block;
		position: relative;

		.input-append {
			width: 100%;
			display: block;
			overflow: hidden;
			position: relative;

			input[type='text'] {
				width: 100%;
				background: none;
				border: none;
				padding: 0 14% 0 2%;
				font-size: 1.4em;
				height: 30px;
				color: #cccccc;
				font-family: $font-os;
				font-style: italic;
			}
		}
		.wrap-btn-search {
			display: inline-block;
			position: absolute;
			right: 5%;
			top: 0;
			color: white;
			font-size: 2em;
		}
	}
}

/**Left Menu Mobile**/
.slide-in {
    background-color: #141414;
    width: 240px;
    position: absolute;
    top: 0;
    left: -240px;
    -webkit-transition: left 0.2s ease-in;
    transition: left 0.2s ease-in;

    ul {
	    list-style: none;
	    padding: 0;
	    margin: 0;

		li {
		    padding: 0px 16px 16px;
		    overflow: hidden;
		    text-align: center;

		    &:first-child {
		    	padding: 16px;
		    }
		    span {
		    	display: block;

		    	&.highlight {
		    		width: 100%;
		    		height: 1px;
		    		background-color: #333333;
		    		margin-top: 16px;
		    	}
		    }
		    a {
		    	color: white;
		    	text-transform: uppercase;
		    	font-family: $font-os;
		    	font-size: 1.4em;
		    }
		    .wrap-top {
		    	.left {
		    		float: left;
		    		text-align: center;
		    		width: 35%;
		    		position: relative;

		    		.btn-choose-lang {
		    			width: 100%;
						display: block;
						background-color: #272626;
						line-height: 2.7em;
						font-size: 1.2em;
						cursor: pointer;

						i {
							margin-left: 35%;
						}
		    		}
		    	}
		    	.right {
		    		float: right;

				    .wrap-social {
				    	overflow: hidden;

				    	a {
				    		display: inline-block;

					    	i {
					    		font-size: 2.7em;
					    		color: white;

					    		&.fa-youtube-square {
					    			margin-left: 14px;
					    		}
					    	}
				    	}

				    }		    		
		    	}
		    }
		    .btn {
		    	line-height: 2.7em;
		    	margin: 14px 0 0;
		    	padding: 0;
		    	font-size: 1.4em;
			    &.btn-lg {
			    }
			    &.btn-login-fb {
			    	background-color: #3367d3;

			    	.wrap-icon {
			    		width: 20%;
						background-color: #2657bb;
						display: block;
						float: left;
			    	}
			    	.name {
			    		width: 80%;
						text-align: center;
						display: inline-block;
						line-height: 2.7em;
			    	}
			    }
		    }
		    .wrap-user {
		    	display: block;
		    	margin: 14px 0 0;
		    	text-align: left;

		    	.wrap-img {
		    		display: block;
		    		float: left;
		    		overflow: hidden;
		    		width: 35px;
		    		height: 35px;
		    		@include border-radius(50%);
		    	}
		    	.name {
		    		display: inline-block;
					margin-left: 5%;
					line-height: 35px;
					font-size: 2em;
					color: #ee3e80;
					font-weight: 100;
		    	}
		    }
		    .warp-blk-list-lang {
	            background-color: #cccccc;
	            height: auto;
	            min-width: 100%;
	            border: none;
	            padding: 0;
	            border-radius: 0;

	            .arrow_box {
	                position: relative;
	                background: #cccccc;
	                position: absolute;
	                top: 0px;
	                right: 23%;
	            }
	            .arrow_box:after {
	                bottom: 100%;
	                left: 50%;
	                border: solid transparent;
	                content: " ";
	                height: 0;
	                width: 0;
	                position: absolute;
	                pointer-events: none;
	                border-color: rgba(204, 204, 204, 0);
	                border-bottom-color: #cccccc;
	                border-width: 8px;
	                margin-left: -8px;
	            }
	            ul {
	            	overflow: hidden;
					padding: 0;
					margin: 0;					

	                li {
	                    display: block;
						float: none;
						padding: 5px 0;
						margin: 0;
						height: auto;
						width: auto;
						text-align: center;
						border: 0;

	                    &:hover {
	                        background-color: #333333;
	                    }
	                    a {
	                    	color: #ffffff;
	                        display: block;
	                        font-family: $font-roboto;
	                    }
	                }
	            }
	        }
		}
	}	
}
 
.slide-in.on {
    left: 0px !important;
}
 
#container.on {
    left: 240px !important;
}


#container {
    width: 100%;
    overflow: scroll; /* Overflow should scroll */
    left: 0px;
    -webkit-overflow-scrolling: touch; /* This gives us scrollbars. */
    position: fixed; /* This means we don't have to worry about overflow issues */
    -webkit-transition: left 0.2s ease-in;
    transition: left 0.2s ease-in;
}